// 引入 react 依赖
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Text, View, Image, TouchableOpacity, ImageBackground, ScrollView, InteractionManager, WebView, BackHandler } from 'react-native';

// 引入第三方依赖
import _ from 'lodash';
import pureRender from 'pure-render-decorator';
import { Actions } from 'react-native-router-flux';

// antd 按需加载
import { Tabs, Toast } from '@ant-design/react-native';

// 引入 处理数据 所需文件
import { } from './module/module.js'

// 引入样式
import Style from './style/style.js';

// 引入公用组件
import { Status, NavBar } from '../../components/index.js'

// 引入专用组件
import { } from './components'

// 引入工具包
import { press, size, ScreenWidth } from '../../util/utils.js'
class PayResults extends Component {

  componentDidMount() {
    // InteractionManager.runAfterInteractions(() => {
    // ...耗时较长的同步执行的任务...
    // });
    this.webview.injectJavaScript(`document.getElementsByTagName('form')[0].submit()`);
    this.backHandler = BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);

  }


  handleBackPress = () => {
    Actions.pop({ refresh: { isRefresh: true }, timeout: 1 })
    return true
  }

  render() {
    const { html } = this.props
    const INJECTED_JAVASCRIPT = `(function() {
      document.getElementsByTagName('form')[0].submit()
  })();`;
    return (
      <View style={Style.container}>
        <Status />
        <NavBar
          title="支付中"
          back={this.handleBackPress}
        />
        <WebView
          style={{
            width: ScreenWidth,
            flex: 1
          }}
          injectedJavaScript={INJECTED_JAVASCRIPT}
          ref={(el) => { this.webview = el; }}
          originWhitelist={['*']}
          source={{ html: html }}
        />
      </View >
    );
  }
}


export default connect(state => ({
  user: state.user,
}))(pureRender(PayResults))
